<template>
    <div class="app-container">
        <div class="table-wrapper">
            <h4>
                道路易损性计算
                <el-button type="primary" @click="router.push('/lifelineVulnerAnalysis/roadVulnerCalc?type=back')" style="float: right;">返回</el-button>
            </h4>
            <el-form :inline="true" ref="queryRef" :rules="rules" label-position="right" :model="params"
                label-width="300px">
                <el-row justify="start">
                    <el-col :span="10">
                        <el-form-item label="编号：" class="form-item" prop="code">
                            <el-input v-model="params.code" placeholder="" disabled readonly />
                        </el-form-item>
                    </el-col>
                    <el-col :span="14">
                        <!-- <el-form-item label="区域：" class="form-item" prop="region">
                            <el-form-item prop="province" style="width:120px;margin-right:10px;">
                                <el-select v-model="params.province" placeholder="请选择省" @change="chooseProvince" disabled
                                    readonly value-key="id">
                                    <el-option v-for="item in provinceData" :key="item.id" :label="item.name" :value="item">
                                    </el-option>
                                </el-select>
                            </el-form-item>
                            <el-form-item prop="city" style="width:120px;margin-right:10px;">
                                <el-select v-model="params.city" placeholder="请选择市" @change="chooseCity" disabled readonly
                                    value-key="id">
                                    <el-option v-for="item in cityData" :key="item.id" :label="item.name" :value="item">
                                    </el-option>
                                </el-select>
                            </el-form-item>
                            <el-form-item prop="county" style="width:120px;">
                                <el-select v-model="params.county" placeholder="请选择县" @change="chooseCounty" disabled
                                    readonly value-key="id">
                                    <el-option v-for="item in areaData" :key="item.id" :label="item.name" :value="item">
                                    </el-option>
                                </el-select>
                            </el-form-item>
                        </el-form-item> -->
                    </el-col>
                </el-row>
                <el-row justify="start">
                    <el-col :span="10">
                        <el-form-item label="基本烈度：" class="form-item" prop="intensity">
                            <el-select v-model="params.intensity" placeholder="请选择" class="form-select" disabled
                                readonly>
                                <el-option v-for="item in optionList2" :key="item.dictItemCode" :label="item.dictItemName"
                                    :value="item.dictItemCode">
                                </el-option>
                            </el-select>
                        </el-form-item>
                    </el-col>
                    <el-col :span="14">
                        <el-form-item label="路基土：" class="form-item" prop="roadbedSoil">
                            <el-select v-model="params.roadbedSoil" placeholder="请选择" class="form-select" disabled readonly>
                                <el-option v-for="item in optionList3" :key="item.dictItemCode" :label="item.dictItemName"
                                    :value="item.dictItemCode">
                                </el-option>
                            </el-select>
                        </el-form-item>
                    </el-col>
                </el-row>
                <el-row justify="start">
                    <el-col :span="10">
                        <el-form-item label="场地类别：" class="form-item" prop="siteSoil">
                            <el-select v-model="params.siteSoil" placeholder="请选择" class="form-select" disabled readonly>
                                <el-option v-for="item in optionList4" :key="item.dictItemCode" :label="item.dictItemName"
                                    :value="item.dictItemCode">
                                </el-option>
                            </el-select>
                        </el-form-item>
                    </el-col>
                    <el-col :span="14">
                        <el-form-item label="地基失效程度：" class="form-item" prop="foundationFail">
                            <el-select v-model="params.foundationFail" placeholder="请选择" class="form-select" disabled
                                readonly>
                                <el-option v-for="item in optionList5" :key="item.dictItemCode" :label="item.dictItemName"
                                    :value="item.dictItemCode">
                                </el-option>
                            </el-select>
                        </el-form-item>
                    </el-col>
                </el-row>
                <el-row justify="start">
                    <el-col :span="10">
                        <el-form-item label="路基类型：" class="form-item" prop="roadbedType">
                            <el-select v-model="params.roadbedType" placeholder="请选择" class="form-select" disabled readonly>
                                <el-option v-for="item in optionList6" :key="item.dictItemCode" :label="item.dictItemName"
                                    :value="item.dictItemCode">
                                </el-option>
                            </el-select>
                        </el-form-item>
                    </el-col>
                    <el-col :span="14">
                        <el-form-item label="路基高程H(m)：" class="form-item" prop="roadbedHigh">
                            <el-select v-model="params.roadbedHigh" placeholder="请选择" class="form-select" disabled
                                readonly>
                                <el-option v-for="item in optionList7" :key="item.dictItemCode" :label="item.dictItemName"
                                        :value="item.dictItemCode">
                                </el-option>
                            </el-select>
                        </el-form-item>
                    </el-col>
                </el-row>
                <el-row justify="start">
                    <el-col :span="10">
                        <el-form-item label="设防烈度:" class="form-item" prop="intensity">
                            <el-select v-model="params.intensity" placeholder="请选择" class="form-select" disabled readonly>
                                <el-option v-for="item in optionList1" :key="item.dictItemCode" :label="item.dictItemName"
                                        :value="item.dictItemCode">
                                </el-option>
                            </el-select>
                        </el-form-item>
                    </el-col>
                    <el-col :span="14">
                        <el-form-item label="年代：" class="form-item" prop="years">
                            <el-input v-model="params.year" placeholder="请输入" disabled readonly />
                            <!-- <el-select v-model="params.year" class="form-select" disabled readonly>
                                <el-option v-for="item in yearsOptions" :key="item.value" :label="item.label"
                                    :value="item.value">
                                </el-option>
                            </el-select> -->
                        </el-form-item>
                    </el-col>
                </el-row>
                <el-row justify="start">
                    <el-col :span="10">
                        <el-form-item label="维护人：" class="form-item" prop="userName">
                            <el-input v-model="params.userName" placeholder="" readonly />
                        </el-form-item>
                    </el-col>
                    <el-col :span="14">
                        <el-form-item label="维护时间：" class="form-item" prop="createTime">
                            <el-date-picker v-model="params.createTime" type="date" value-format="YYYY-MM-DD"
                                placeholder="选择日期">
                            </el-date-picker>
                        </el-form-item>
                    </el-col>
                </el-row>
                <el-row justify="start">
                    <el-form-item label="维护人所属单位：" class="form-item" prop="maintainerUnit" style="width: 80%;">
                        <el-input v-model="params.orgName" placeholder="" readonly />
                    </el-form-item>
                </el-row>
                <el-row justify="start">
                    <el-form-item label="备注：" class="form-item" prop="note" style="width: 80%;">
                        <el-input v-model="params.note" type="textarea" placeholder="" readonly />
                    </el-form-item>
                </el-row>

                <!-- 计算结果 -->
                <div class="comparison">
                    <div>
                        <!-- 公式 -->
                        <MultilineFormula display="inline-block" font-size="20px" tagOffset="-3px" :option="[
                            { content: 'u', sub: 'Bi' },
                            { content: '(ind)' },
                            { content: '=' },
                            { content: 'e' },
                            {
                                rows: [
                                    [
                                        { content: '-(ind-ind)', super: '2' },
                                        { content: '-', left: '-30px', top: '-12px' }
                                    ],
                                    [{ content: '2σ', sub: 'i', super: '2' }]
                                ],
                                style: {
                                    marginTop: '-50px'
                                }
                            },
                        ]" />
                        <MultilineFormula display="inline-block" font-size="20px" tagOffset="-3px"
                            style="margin-left: 80px;" :option="[
                                { content: 'ind', sub: 'i' },
                                { content: '-', left: '-18px', top: '-12px' },
                                { content: '=' },
                                { content: '0.2' },
                                { content: '∏', scale: '1.5', topContent: '7', bottomContent: 'j=1', margin: '0 0 0 5px' },
                                { content: 'X', sub: 'ij' },
                                { content: '-' },
                                { content: '0.1' },
                            ]" />
                        <span class="equal">=</span>
                        <el-input v-model="params.ubInd" placeholder="" readonly></el-input>
                    </div>
                    <div>
                        <Formula display="inline-block" font-size="20px" tagOffset="-3px" fontWeight="bold" :option="[
                            { content: 'σ', sub: 'i' },
                        ]" />
                        <span class="equal">=</span>
                        <el-input v-model="params.oi" placeholder="" readonly></el-input>
                    </div>
                    <div>
                        <h2 style="display: inline-block;">确定震害度的概率密度函数：</h2>
                        <MultilineFormula display="inline-block" font-size="20px" tagOffset="-3px" :option="[
                            { content: 'f(x)' },
                            { content: '=' },
                            { content: 'e' },
                            {
                                rows: [
                                    [
                                        { content: '-(x-' },
                                        { content: 'ind', sub: 'i' },
                                        { content: '-', left: '-18px', top: '-12px' },
                                        { content: ')', super: '2' },
                                    ],
                                    [{ content: '0.08' }]
                                ],
                                style: {
                                    marginTop: '-50px'
                                }
                            },
                        ]" />
                    </div>

                    <h2>不同震害等级的概率：</h2>
                    <div class="div-flex">
                        <MultilineFormula display="inline-block" font-size="20px" :option="[
                            { content: 'P(0＜X≤0.2)' },
                            { content: '=' },
                            { content: '0.2', },
                            {
                                rows: [
                                    [{ content: '2π' }]
                                ],
                                radical: true,
                                style: { marginLeft: '15px', padding: '0 0 0 5px' },
                            },
                            { content: '(' },
                            { content: 'Φ' },
                            { content: '(' },
                            {
                                rows: [
                                    [
                                        { content: '0.2-ind', sub: 'i' },
                                        { content: '-', left: '-18px', top: '-12px' }
                                    ],
                                    [{ content: '0.2' }]
                                ]
                            },
                            { content: ')' },
                            { content: '-' },
                            { content: 'Φ' },
                            { content: '(' },
                            {
                                rows: [
                                    [
                                        { content: '0-ind', sub: 'i' },
                                        { content: '-', left: '-18px', top: '-12px' }
                                    ],
                                    [{ content: '0.2' }]
                                ]
                            },
                            { content: ')' },
                            { content: ')' },
                        ]" />
                        <span class="equal">=</span>
                        <el-input v-model="params.p02" placeholder="" readonly></el-input>
                    </div>
                    <div class="div-flex">
                        <MultilineFormula display="inline-block" font-size="20px" :option="[
                            { content: 'P(0.2＜X≤0.4)' },
                            { content: '=' },
                            { content: '0.2' },
                            {
                                rows: [
                                    [{ content: '2π' }]
                                ],
                                radical: true,
                                style: { marginLeft: '15px', padding: '0 0 0 5px' },
                            },
                            { content: '(' },
                            { content: 'Φ' },
                            { content: '(' },
                            {
                                rows: [
                                    [
                                        { content: '0.4-ind', sub: 'i' },
                                        { content: '-', left: '-18px', top: '-12px' }
                                    ],
                                    [{ content: '0.2' }]
                                ]
                            },
                            { content: ')' },
                            { content: '-' },
                            { content: 'Φ' },
                            { content: '(' },
                            {
                                rows: [
                                    [
                                        { content: '0.2-ind', sub: 'i' },
                                        { content: '-', left: '-18px', top: '-12px' }
                                    ],
                                    [{ content: '0.2' }]
                                ]
                            },
                            { content: ')' },
                            { content: ')' },
                        ]" />
                        <span class="equal">=</span>
                        <el-input v-model="params.p24" placeholder="" readonly></el-input>
                    </div>
                    <div class="div-flex">
                        <MultilineFormula display="inline-block" font-size="20px" :option="[
                            { content: 'P(0.4＜X≤0.6)' },
                            { content: '=' },
                            { content: '0.2' },
                            {
                                rows: [
                                    [{ content: '2π' }]
                                ],
                                radical: true,
                                style: { marginLeft: '15px', padding: '0 0 0 5px' },
                            },
                            { content: '(' },
                            { content: 'Φ' },
                            { content: '(' },
                            {
                                rows: [
                                    [
                                        { content: '0.6-ind', sub: 'i' },
                                        { content: '-', left: '-18px', top: '-12px' }
                                    ],
                                    [{ content: '0.2' }]
                                ]
                            },
                            { content: ')' },
                            { content: '-' },
                            { content: 'Φ' },
                            { content: '(' },
                            {
                                rows: [
                                    [
                                        { content: '0.4-ind', sub: 'i' },
                                        { content: '-', left: '-18px', top: '-12px' }
                                    ],
                                    [{ content: '0.2' }]
                                ]
                            },
                            { content: ')' },
                            { content: ')' },
                        ]" />
                        <span class="equal">=</span>
                        <el-input v-model="params.p46" placeholder="" readonly></el-input>
                    </div>
                    <div class="div-flex">
                        <MultilineFormula display="inline-block" font-size="20px" :option="[
                            { content: 'P(0.6＜X≤0.8)' },
                            { content: '=' },
                            { content: '0.2' },
                            {
                                rows: [
                                    [{ content: '2π' }]
                                ],
                                radical: true,
                                style: { marginLeft: '15px', padding: '0 0 0 5px' },
                            },
                            { content: '(' },
                            { content: 'Φ' },
                            { content: '(' },
                            {
                                rows: [
                                    [
                                        { content: '0.8-ind', sub: 'i' },
                                        { content: '-', left: '-18px', top: '-12px' }
                                    ],
                                    [{ content: '0.2' }]
                                ]
                            },
                            { content: ')' },
                            { content: '-' },
                            { content: 'Φ' },
                            { content: '(' },
                            {
                                rows: [
                                    [
                                        { content: '0.6-ind', sub: 'i' },
                                        { content: '-', left: '-18px', top: '-12px' }
                                    ],
                                    [{ content: '0.2' }]
                                ]
                            },
                            { content: ')' },
                            { content: ')' },
                        ]" />
                        <span class="equal">=</span>
                        <el-input v-model="params.p68" placeholder="" readonly></el-input>
                    </div>
                    <div class="div-flex">
                        <MultilineFormula display="inline-block" font-size="20px" :option="[
                            { content: 'P(0.8＜X≤1.0)' },
                            { content: '=' },
                            { content: '0.2' },
                            {
                                rows: [
                                    [{ content: '2π' }]
                                ],
                                radical: true,
                                style: { marginLeft: '15px', padding: '0 0 0 5px' },
                            },
                            { content: '(' },
                            { content: 'Φ' },
                            { content: '(' },
                            {
                                rows: [
                                    [
                                        { content: '1.0-ind', sub: 'i' },
                                        { content: '-', left: '-18px', top: '-12px' }
                                    ],
                                    [{ content: '0.2' }]
                                ]
                            },
                            { content: ')' },
                            { content: '-' },
                            { content: 'Φ' },
                            { content: '(' },
                            {
                                rows: [
                                    [
                                        { content: '0.8-ind', sub: 'i' },
                                        { content: '-', left: '-18px', top: '-12px' }
                                    ],
                                    [{ content: '0.2' }]
                                ]
                            },
                            { content: ')' },
                            { content: ')' },
                        ]" />
                        <span class="equal">=</span>
                        <el-input v-model="params.p810" placeholder="" readonly></el-input>
                    </div>

                    <h2 class="formula-title-name">基本完好概率为：</h2>
                    <div class="div-flex">
                        <MultilineFormula display="inline-block" font-size="20px" :option="[
                            {
                                rows: [
                                    [
                                        { content: 'P(0＜X≤0.2)' },
                                    ],
                                    [
                                        { content: 'P(0＜X≤0.2)+P(0.2＜X≤0.4)+P(0.4＜X≤0.6)+P(0.6＜X≤0.8)+P(0.8＜X≤1.0)' }
                                    ]
                                ]
                            },
                        ]" />
                        <span class="equal">=</span>
                        <el-input v-model="params.basicIntact" placeholder="" readonly></el-input>
                        <!-- <span style="margin-left: 20px;">修正值：</span>
                        <el-input v-model="params.basicIntactCorrect" :rules="rules.basicIntactCorrect" readonly></el-input> -->
                    </div>
                    <h2 class="formula-title-name">轻微破坏概率为：</h2>
                    <div class="div-flex">
                        <MultilineFormula display="inline-block" font-size="20px" :option="[
                            {
                                rows: [
                                    [
                                        { content: 'P(0.2＜X≤0.4)' },
                                    ],
                                    [
                                        { content: 'P(0＜X≤0.2)+P(0.2＜X≤0.4)+P(0.4＜X≤0.6)+P(0.6＜X≤0.8)+P(0.8＜X≤1.0)' }
                                    ]
                                ]
                            },
                        ]" />
                        <span class="equal">=</span>
                        <el-input v-model="params.slightDamage" placeholder="" readonly></el-input>
                        <!-- <span style="margin-left: 20px;">修正值：</span>
                        <el-input v-model="params.slightDamageCorrect" :rules="rules.slightDamageCorrect"
                            readonly></el-input> -->
                    </div>
                    <h2 class="formula-title-name">中等破坏概率为:</h2>
                    <div class="div-flex">
                        <MultilineFormula display="inline-block" font-size="20px" :option="[
                            {
                                rows: [
                                    [
                                        { content: 'P(0.4＜X≤0.6)' },
                                    ],
                                    [{ content: 'P(0＜X≤0.2)+P(0.2＜X≤0.4)+P(0.4＜X≤0.6)+P(0.6＜X≤0.8)+P(0.8＜X≤1.0)' }]
                                ]
                            },
                        ]" />
                        <span class="equal">=</span>
                        <el-input v-model="params.moderateDamage" placeholder="" readonly></el-input>
                        <!-- <span style="margin-left: 20px;">修正值：</span>
                        <el-input v-model="params.moderateDamageCorrect" :rules="rules.moderateDamageCorrect"
                            readonly></el-input> -->
                    </div>
                    <h2 class="formula-title-name">严重破坏概率为：</h2>
                    <div class="div-flex">
                        <MultilineFormula display="inline-block" font-size="20px" :option="[
                            {
                                rows: [
                                    [
                                        { content: 'P(0.6＜X≤0.8)' },
                                    ],
                                    [{ content: 'P(0＜X≤0.2)+P(0.2＜X≤0.4)+P(0.4＜X≤0.6)+P(0.6＜X≤0.8)+P(0.8＜X≤1.0)' }]
                                ]
                            },
                        ]" />
                        <span class="equal">=</span>
                        <el-input v-model="params.badlyDamaged" placeholder="" readonly></el-input>
                        <!-- <span style="margin-left: 20px;">修正值：</span>
                        <el-input v-model="params.badlyDamagedCorrect" :rules="rules.badlyDamagedCorrect"
                            readonly></el-input> -->
                    </div>
                    <h2 class="formula-title-name">毁坏概率为：</h2>
                    <div class="div-flex">
                        <MultilineFormula display="inline-block" font-size="20px" :option="[
                            {
                                rows: [
                                    [
                                        { content: 'P(0.8＜X≤1.0)' },
                                    ],
                                    [{ content: 'P(0＜X≤0.2)+P(0.2＜X≤0.4)+P(0.4＜X≤0.6)+P(0.6＜X≤0.8)+P(0.8＜X≤1.0)' }]
                                ]
                            },
                        ]" />
                        <span class="equal">=</span>
                        <el-input v-model="params.destroy" placeholder="" readonly></el-input>
                        <!-- <span style="margin-left: 20px;">修正值：</span>
                        <el-input v-model="params.destroyCorrect" :rules="rules.destroyCorrect" readonly></el-input> -->
                    </div>
                </div>
            </el-form>
        </div>
    </div>
</template>

<script setup>
import { reactive, toRefs } from "vue";
// 接口
import { getInfo } from '@/api/login';
// 行政区划接口
import {
    getProvince,//获取省份
    getChildArea,//获取子区域
} from "@/api/system/division";
import { getValidDictItemsByDictCode } from "@/api/map/disasterDataManagement/lifelineSystemInfo.js";
// 公用方法
import { parseTime } from "@/utils/ruoyi.js";
// 引入公式组件
import Formula from '@/components/Formula';
import MultilineFormula from '@/components/Formula/multiline';

// 引入store
import useDictStore from '@/store/modules/dict';
// 获取pinia
const dictStore = useDictStore();
// 当前路由
const route = useRoute();
// 全局路由
const router = useRouter();

//最多保留N小数 ,N 在 options {decimals: N} 中定义
const positivedecimals = (rule, value, callback) => {
    value = String(value);
    if (
        value.indexOf(".") != -1 &&
        (value.split(".").length > rule.options.decimals ||
            value.split(".")[0] === "" ||
            value.split(".")[1] === "")
    ) {
        callback(new Error()); //防止输入多个小数点
    } else if (value.indexOf(".") != -1 && value.split(".")[1].length > rule.options.decimals) {
        callback(new Error()); //小数点后两位
    } else {
        callback();
    }
};
//验证是否yyyy年份（非必填）
const isYearNotMust = (rule, value, callback) => {
  if (value == '' || value == undefined || value == null) {
    callback();
  } else if (isNaN(Number(value))) {
    callback(new Error('请输入yyyy格式如2022'));
  } else if (value.toString().length!=4) {
    callback(new Error('请输入yyyy格式如2022'));
  } else if (value.toString().indexOf(".")!=-1) {
    callback(new Error('请输入yyyy格式如2022'));
  } else {
    callback();
  }
}
const data = reactive({
    // 表单参数
    params: {
        number: "",//桥梁名称
        year: "",//年代
        intensity: "",//基本烈度
        roadbedSoil: "",//路基土
        siteSoil: "",//场地类别
        foundationFail: "",//地基失效程度
        intensity: "",//设防烈度
        roadbedType: "",//路基类型
        roadbedHigh: "",//路基高程H(m)
        province: "",//省
        city: "",//市
        county: "",//区、县
        creatTime: "", //维护时间
        userName: "", //维护人
        maintainerUnit: "", //维护人所属单位
        note: "",//备注
        result: "",//结果

        // 计算结果
        ubInd: '',
        oi: '',
        p02: '',
        p24: '',
        p46: '',
        p68: '',
        p810: '',
        basicIntact: '',
        slightDamage: '',
        moderateDamage: '',
        badlyDamaged: '',
        destroy: '',
        basicIntactCorrect: '',
        slightDamageCorrect: '',
        moderateDamageCorrect: '',
        badlyDamagedCorrect: '',
        destroyCorrect: '',
    },
    // 表单验证规则
    rules: {
        // number: [
        //     { required: true, message: '请输入', trigger: 'blur' },
        // ],
        year:  [{
				required: true,
				message: "请输入正确数值",
				validator: isYearNotMust,
				trigger: ["change", "blur"],
			}],
        region: [
            { required: true, message: '请选择', trigger: 'change' }
        ],
        intensity: [
            { required: true, message: '请选择', trigger: 'change' }
        ],
        roadbedSoil: [
            { required: true, message: '请选择', trigger: 'change' }
        ],
        siteSoil: [
            { required: true, message: '请选择', trigger: 'change' }
        ],
        foundationFail: [
            { required: true, message: '请选择', trigger: 'change' }
        ],
        intensity: [
            { required: true, message: '请选择', trigger: 'change' }
        ],
        roadbedType: [
            { required: true, message: '请选择', trigger: 'change' }
        ],
        roadbedHigh: [
            { required: true, message: '请选择', trigger: 'change' }
        ],
        note: [
            { required: false, message: "请输入", trigger: "blur" },
            { max: 500, message: "最多输入500个字", trigger: ["change", "blur"] },
        ],
        basicIntactCorrect: [
            { required: true, message: "请输入", trigger: "blur" },
            {
                message: "请输入正确数值，最多保留四位小数",
                validator: positivedecimals,
                options: { decimals: 4 },
                trigger: ["change", "blur"],
            },
        ],
        slightDamageCorrect: [
            { required: true, message: "请输入", trigger: "blur" },
            {
                message: "请输入正确数值，最多保留四位小数",
                validator: positivedecimals,
                options: { decimals: 4 },
                trigger: ["change", "blur"],
            },
        ],
        moderateDamageCorrect: [
            { required: true, message: "请输入", trigger: "blur" },
            {
                message: "请输入正确数值，最多保留四位小数",
                validator: positivedecimals,
                options: { decimals: 4 },
                trigger: ["change", "blur"],
            },
        ],
        badlyDamagedCorrect: [
            { required: true, message: "请输入", trigger: "blur" },
            {
                message: "请输入正确数值，最多保留四位小数",
                validator: positivedecimals,
                options: { decimals: 4 },
                trigger: ["change", "blur"],
            },
        ],
        destroyCorrect: [
            { required: true, message: "请输入", trigger: "blur" },
            {
                message: "请输入正确数值，最多保留四位小数",
                validator: positivedecimals,
                options: { decimals: 4 },
                trigger: ["change", "blur"],
            },
        ],
    },
    //基本烈度候选值：请选择、Ⅵ、Ⅶ、Ⅷ、Ⅸ、
    basicIntensityOptions: dictStore.basicIntensityOptions || [],
    //场地类别候选值：请选择、I类、II类、Ⅲ类、IV类
    siteOptions: dictStore.siteOptions || [],
    //设防烈度候选值：请选择、已设防、未设防、已有损坏
    intensityOptions: dictStore.intensityOptions || [],
    // 年份
    yearsOptions: dictStore.yearsOptions1 || [],
    //路基土
    roadbedSoilOptions: [
        {
            value: '坚硬土',
            label: '坚硬土'
        }, {
            value: '粘土',
            label: '粘土'
        }, {
            value: '粉土',
            label: '粉土'
        }, {
            value: '细砂土',
            label: '细砂土'
        }, {
            value: '分期施工路基',
            label: '分期施工路基'
        }
    ],
    //地基失效程度候选值：无、轻、重
    foundationFailOptions: [
        {
            value: '无',
            label: '无'
        }, {
            value: '轻',
            label: '轻'
        }, {
            value: '中',
            label: '中'
        }, {
            value: '重',
            label: '重'
        }
    ],
    //路基类型候选值：请选择、低矮路基、路堤路堑、挖填结合、沿河路基
    roadbedTypeOptions: [
        {
            value: '低矮路基',
            label: '低矮路基'
        }, {
            value: '路堤路堑',
            label: '路堤路堑'
        }, {
            value: '挖填结合',
            label: '挖填结合'
        }, {
            value: '沿河路基',
            label: '沿河路基'
        }
    ],
    //路基高程H(m)候选值：请选择、H≤1、1<H≤2、2<H≤3、3<H
    roadbedElevationOptions: [
        {
            value: 'H≤1',
            label: 'H≤1'
        }, {
            value: '1<H≤2',
            label: '1<H≤2'
        }, {
            value: '2<H≤3',
            label: '2<H≤3'
        }, {
            value: '3<H',
            label: '3<H'
        }
    ],
});
const {
    params,
    rules,
    basicIntensityOptions,
    siteOptions,
    intensityOptions,
    yearsOptions,
    roadbedSoilOptions,
    foundationFailOptions,
    roadbedTypeOptions,
    roadbedElevationOptions,
} = toRefs(data);

// 行政区划
const provinceData = ref([]); //省
const cityData = ref([]); //市
const areaData = ref([]); //区、县
/** 获取省列表 */
function getProvinceData() {
    getProvince().then((response) => {
        provinceData.value = response.data;
    });
}
// 选择省份
function chooseProvince(value) {
    params.value.city = null;
    params.value.county = null;
    params.value.province = value.name;
    cityData.value = [];
    areaData.value = [];
    getChildArea(value.id).then(response => {
        cityData.value = response.data;
    });
}
// 选择城市
function chooseCity(value) {
    params.value.city = value.name;
    params.value.county = null;
    areaData.value = [];
    getChildArea(value.id).then((response) => {
        areaData.value = response.data;
    });
}
// 选择区县
function chooseCounty(value) {
    params.value.county = value.name;
}

// 获取用户
function getUserInfo(userId) {
    getInfo(userId).then(response => {
        const { user } = response;
        if (user) {
            params.value.userName = user.userName;
            params.value.maintainerUnit = user.orgName;
        }
    });
};
// 字典表查询
const optionList1 = ref([])
const optionList2 = ref([])
const optionList3 = ref([])
const optionList4 = ref([])
const optionList5 = ref([])
const optionList6 = ref([])
const optionList7 = ref([])
/** 获取字典值 */
async function getDictData() {
    await getValidDictItemsByDictCode("smxsfqk").then(response => {
        optionList1.value = response.data;//设防情况
    });
    await getValidDictItemsByDictCode("smxsfld").then(response => {
        optionList2.value = response.data;//基本烈度
    });
    await getValidDictItemsByDictCode("smxdlljt").then(response => {
        optionList3.value = response.data;//路基土
    });
    await getValidDictItemsByDictCode("smxcdlb").then(response => {
        optionList4.value = response.data;//场地类别
    });
    await getValidDictItemsByDictCode("smxdldjsx").then(response => {
        optionList5.value = response.data;//地基失效
    });
    await getValidDictItemsByDictCode("smxdlljlx").then(response => {
        optionList6.value = response.data;//路基类型
    });
    await getValidDictItemsByDictCode("smxdllmgc").then(response => {
        optionList7.value = response.data;//路基高程
    });
}
getDictData();
// 挂载
onMounted(() => {
    const query = route.query;
    // 获取省份
    // getProvinceData();
    // 回显数据
    if (query) {
        params.value = { ...query };
        console.log(params.value);
        // 维护时间
        if (query.updateTime || query.createTime) {
            const dateTime = new Date(query.updateTime || query.createTime)
            params.value.createTime = parseTime(dateTime);
        } else {
            params.value.createTime = '';
        }
        // 根据id获取用户信息
        if (query.createUser) {
            getUserInfo(query.createUser);
        }
    }
});
</script>

<style lang="scss">
.table-wrapper {
    position: relative;

    h4 {
        font-size: 16px;
        font-weight: bold;
        color: #107ce5;
        text-align: center;
    }

    .comparison {
        margin-top: 40px;
        padding-left: 300px;

        h4 {
            text-align: left;
        }

        /* 每行 */
        >div {
            margin-bottom: 20px;
        }

        /* 等号 */
        .equal {
            margin: 0 10px;
        }

        .div-flex {
            display: flex;
            justify-content: flex-start;
            align-items: center;
        }

        .formula-title-name {
            line-height: 65px;
            margin: 0;
        }

        .el-input {
            width: 120px;
        }
    }

}</style>


